<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <body>
        <!-- chrome调试工具--查看CSS属性 -->
        <!-- 标签页含义
        elements 查看标签结构
        console 查看控制台
        source 查看源码+断点调试
        network 查看前后端交互过程
        application 查看浏览器提供的一些扩展功能(本地存储等)
        
        elements 标签页使用
        ctrl + 滚轮进行缩放, ctrl + 0 恢复原始大小.
        使用 左上角 箭头选中元素
        右侧可以查看当前元素的属性, 包括引入的类.
        右侧可以修改选中元素的 css 属性. 例如颜色, 可以点击颜色图标, 弹出颜色选择器, 修改颜色. 例如
        字体大小, 可以使用方向键来微调数值. 
        此处的修改不会影响代码, 刷新就还原了~
        如果 CSS 样式写错了, 也会在这里有提示. (黄色感叹号) -->
    </body>
</html>